﻿<phone:PhoneApplicationPage
    x:Class="Techdays2013.ControlsPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    xmlns:behaviors="clr-namespace:SamuelBlanchard.Accessibility" 
    
    behaviors:SpeechBehavior.CanSpeak="True"
    behaviors:SpeechBehavior.Language="fr-FR"
    
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    toolkit:TiltEffect.IsTiltEnabled="True"
    shell:SystemTray.IsVisible="True"  
    >

    <phone:PhoneApplicationPage.Resources>
        <phone:JumpListItemBackgroundConverter x:Key="BackgroundConverter"/>
        <phone:JumpListItemForegroundConverter x:Key="ForegroundConverter"/>
        <Style x:Key="ContactsJumpListStyle" TargetType="phone:LongListSelector">
            <Setter Property="GridCellSize"  Value="113,113"/>
            <Setter Property="LayoutMode" Value="Grid" />
            <Setter Property="ItemTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Border Background="{Binding Converter={StaticResource BackgroundConverter}}" Width="113" Height="113" Margin="6" >
                            <TextBlock Text="{Binding Key}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" FontSize="48" Padding="6" Foreground="{Binding Converter={StaticResource ForegroundConverter}}" VerticalAlignment="Center"/>
                        </Border>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <DataTemplate x:Key="ContactsItemTemplate">
            <StackPanel Orientation="Horizontal">
                <Image Source="{Binding Avatar}" Height="100" Width="100"/>
                <StackPanel Orientation="Vertical" VerticalAlignment="Center">
                    <TextBlock Style="{StaticResource PhoneTextLargeStyle}">
                                <Run Text="{Binding Prenom}"/>
                                <Run Text="{Binding Nom}"/>
                    </TextBlock>
                    <TextBlock Style="{StaticResource PhoneTextSubtleStyle}">
                                <Run Text="{Binding Titre}"/>
                                <Run Text="-"/>
                                <Run Text="{Binding Societe}"/>
                    </TextBlock>
                    <TextBlock Text="{Binding CompteTwitter}" Style="{StaticResource PhoneTextSubtleStyle}"/>
                </StackPanel>
            </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="ContactsGroupHeaderTemplate">
            <Border Background="Transparent" Padding="5">
                <Border Background="{StaticResource PhoneAccentBrush}" BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="2" Width="62" Height="62" Margin="0,0,18,0" HorizontalAlignment="Left">
                    <TextBlock Text="{Binding Key}" Foreground="{StaticResource PhoneForegroundBrush}" FontSize="48" Padding="6" FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" VerticalAlignment="Center"/>
                </Border>
            </Border>
        </DataTemplate>

        <Style x:Key="PersonnagesJumpListStyle" TargetType="phone:LongListSelector">
            <Setter Property="GridCellSize"  Value="113,113"/>
            <Setter Property="LayoutMode" Value="Grid" />
            <Setter Property="ItemTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Border BorderBrush="{Binding Converter={StaticResource BackgroundConverter}}" BorderThickness="1" Margin="6" >
                            <Image Source="{Binding Blason}" VerticalAlignment="Center" HorizontalAlignment="Center" Width="90" Height="90" />
                        </Border>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <DataTemplate x:Key="PersonnagesItemTemplate">
            <StackPanel Orientation="Vertical" VerticalAlignment="Center">
                <TextBlock Style="{StaticResource PhoneTextLargeStyle}">
                                <Run Text="{Binding Prenom}"/>
                                <Run Text="{Binding Nom}"/>
                </TextBlock>
                <TextBlock Style="{StaticResource PhoneTextSubtleStyle}">
                                <Run Text="Maison"/>
                                <Run Text="{Binding Maison}"/>
                </TextBlock>
                <TextBlock Text="{Binding Demeure}" Style="{StaticResource PhoneTextSubtleStyle}"/>
            </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="PersonnagesGroupHeaderTemplate">
            <Border Background="Transparent" Padding="5" Margin="0,10,0,0">
                <StackPanel Orientation="Horizontal">
                    <Border BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="2" Width="62" Height="62" Margin="0,0,18,0" HorizontalAlignment="Left">
                        <Image Source="{Binding Blason}"/>
                    </Border>
                    <TextBlock Style="{StaticResource PhoneTextLargeStyle}" VerticalAlignment="Center">
                        <Run Text="Maison"/>
                        <Run Text="{Binding Key}"/>
                    </TextBlock>
                </StackPanel>
            </Border>
        </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Border Height="173" VerticalAlignment="Top"  Background="Red" Margin="6,6,6,0" Grid.Row="0">
            <StackPanel Margin="12" VerticalAlignment="Center">
                <TextBlock Text="LongListSelector" FontSize="50" FontFamily="Segoe WP light" HorizontalAlignment="Center" Margin="12,0"/>
            </StackPanel>
        </Border>

        <phone:Pivot Margin="0" Grid.Row="1">
            <phone:PivotItem>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <toolkit:ToggleSwitch Grid.Row="0" Content="IsGroupingEnabled" Checked="ToggleSwitch_Checked" Unchecked="ToggleSwitch_Unchecked" Margin="-5"/>
                    <phone:LongListSelector
                        Grid.Row="1" 
                        x:Name="ContactsList"
                        JumpListStyle="{StaticResource ContactsJumpListStyle}"
                        Background="Transparent"
                        GroupHeaderTemplate="{StaticResource ContactsGroupHeaderTemplate}"
                        ItemTemplate="{StaticResource ContactsItemTemplate}"
                        LayoutMode="List"
                        IsGroupingEnabled="true"
                        HideEmptyGroups ="true"/>
                </Grid>
            </phone:PivotItem>
            <phone:PivotItem>
                <phone:LongListSelector
                    x:Name="PersonnagesList"
                    JumpListStyle="{StaticResource PersonnagesJumpListStyle}"
                    Background="Transparent"
                    GroupHeaderTemplate="{StaticResource PersonnagesGroupHeaderTemplate}"
                    ItemTemplate="{StaticResource PersonnagesItemTemplate}"
                    LayoutMode="List"
                    IsGroupingEnabled="true"
                    HideEmptyGroups ="true" />
            </phone:PivotItem>
        </phone:Pivot>
        
        <Grid x:Name="GridFade" Grid.RowSpan="2" Background="Black" Visibility="Collapsed">
        </Grid>
    </Grid>

</phone:PhoneApplicationPage>